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METHOD AND SYSTEM FOR DYNAMIC 
WEB PAGE BREADCRUMBING USING JAVASCRIPT 

BACKGROUND OF THE INVENTION 

Technical Field of the Invention 

The present invention generally relates to navigation within a Website. More 
particularly, the present invention is directed to a method and system for dynamically 
generating and maintaining a client-side breadcrumb navigation trail for improving 
navigation of a plurality of web pages within a Website. 

Description of the Prior Art 

Navigation within a Website generally falls within a simple linear navigation 
architecture, or the more complex breadth-emphasizing and/or depth-emphasizing 
navigational architectures. Invariably, a well-designed Website on the World Wide Web 
(i.e., "WWW") and more generally on the Internet, adheres to a navigational architecture 
that enables a user to easily navigate through the Website's information space (i.e., 
plurality of web pages). The breadth-emphasizing navigation structure reminds the user 
of the full array of information within its information space. That is, such a structure 
depicts all top levels of the Website (i.e., categories) on a particular web page of the 
Website (i.e., as links to those top level web pages), such as at the left margin of the web 
page running the length of the web page or across the top of the web page running from 
the left margin to the right margin. The depth-emphasizing navigation structure depicts { 
hierarchical path through the information space from broader categories through more 
narrower categories through to a final web page, i.e., displaying links from a home page 
of the Website through a plurality intermediary web pages representing categories (i.e., 
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child web pages) to the current page (i.e., also a child web page) atop the current web 
page as breadcrumbs, i.e., breadcrumb navigation. Particular web sites that implement 
breadcrumb navigation include CNET.com, Yahoo.com, ZDNnet.com, Sun.com, and the 
like. 

5 

Presently, myriad web sites implement breadcrumb navigation within their websites. 
Breadcrumbs are HyperText Markup Language (i.e., HTML") links that are displayed 
atop of web pages of a Website that link users to web pages that the user navigated 
through while at the Website. Furthermore, the links are displayed in order from a first 

10 web page (i.e., parent page) to subsequently visited web pages (i.e., child web pages). 
For example, the following links represent breadcrumb navigation from a parent web 
page to a plurality of subsequent web pages: " Home > Computers > Software > Internet > 
TCP/IP". In the foregoing example of breadcrumb navigation, a user is presented with all 
of the pages that the user has visited from the parent web page " Home " to the current 

15 child web page "TCP/IP" in the information space of the Website. It should be noted that 
all of the pages except the last page "TCP/IP" are HTML links, since the last page 
represents a web page that is currently displayed. If, for example, the user were to click 
on the " Computers " link, a child web page associated with this link would include the 
following breadcrumb navigation " Home > Computers". Thus, a user is enabled to 

20 traverse the visited web pages of a Website via the links atop each of the web pages by 
clicking on the appropriate link associated with a visited web page. Separators that 
distinguish one link from another generally include: ">", "->", "/" and the like. 

Different breadcrumbing methods are known in the art. One of the methods hard codes 
25 breadcrumbs as static links in web pages requested by a user (i.e., hard-coded 

breadcrumbing). Another method implements breadcrumbs generated, maintained and 
inserted into web pages by a Website server (i.e., server-side breadcrumbing) and 
transmitted to the user requesting the web pages. Both of the foregoing methods provide 
for navigation of the Website's information space (i.e., plurality of web pages at the 
30 Website) for the user. A deficiency of the hard-coded breadcrumbing method is that the 
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breadcrumbs (i.e., HTML links) may not accurately reflect correct order, link name and 
associated web pages for the navigation structure through the information space of the 
Website. That is, in order to correctly reflect the user's navigation through the Website's 
information space, breadcrumbs must be maintained and updated as the Website changes, 
5 i.e., changes occurring in the web page organization including renaming, deleting, adding 
and moving web pages within the Website. A deficiency of the server-side 
breadcrumbing is that such an implementation places an inordinate load on the server in 
terms of execution time and storage space required to satisfy all user requests for web 
pages utilizing breadcrumbs. 

10 

Therefore there is a need in the art for dynamic client-side breadcrumbing for abating 
deficiencies of the prior art breadcrumbing systems requiring hard coding of the 
breadcrumbs or placing a load upon the Website's server resources for performing 
breadcrumbing. 

15 

SUMMARY OF THE INVENTION 

It is therefore an object of the present invention to provide a system and method for 
dynamically generating breadcrumbs for web pages requested by a plurality of users. 

20 

It is another object of the present invention to provide a system and method for 
dynamically maintaining breadcrumbs. 

It is yet another object of the present invention to provide a system and method for 
25 dynamically maintaining client-side breadcrumbs. 

It is a further object of the present invention to provide a system and method for 
facilitating the plurality of users to navigate a Website utilizing the dynamically 
generated and maintained breadcrumbs. 

30 
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It is yet a further object of the present invention to provide a system and method for 
facilitating users to utilize the dynamically generated and maintained breadcrumbs to 
resume navigation where they left off upon revisiting the Website. 



5 According to an embodiment of the present invention, there is provided a dynamic client- 
side breadcrumbing method for improving navigation of a plurality of web pages within a 
Website, the method comprising: generating a breadcrumb for each web page 
downloaded to a web browser associated with a client from a web server associated with 
the Website, the generated breadcrumb including navigation information for each 
10 downloaded web page; storing breadcrumbs associated with web pages downloaded to 
the web browser at the client; updating the stored breadcrumbs with the generated 
breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with 
navigation of the web pages at the Website; and displaying the breadcrumb navigation 
trail on each downloaded web page for user selection. 

15 

According to another embodiment of the present invention, there is provided a dynamic 
client-side breadcrumbing system for improving navigation of a plurality of web pages 
within a Website, the system comprising: a web server associated with the Website 
transmitting web pages requested by a client, the web pages embedding a breadcrumbing 

20 engine; and a web browser associated with the client downloading the web pages and 
executing the breadcrumbing engine, the breadcrumbing engine for: generating a 
breadcrumb for each web page downloaded to the web browser, the generated 
breadcrumb including navigation information for each downloaded web page, storing 
breadcrumbs associated with web pages downloaded to the web browser at the client, 

25 updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb 
navigation trail of breadcrumbs associated with navigation of the web pages at the 
Website, and displaying the breadcrumb navigation trail on each downloaded web page 
for user selection. 
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According to yet another embodiment of the present invention, there is provided. A 
program storage device, tangibly embodying a program of instructions executable by the 
machine to perform a dynamic client-side breadcrumbing method for improving 
navigation of a plurality of web pages within a Website, the method comprising: 
5 generating a breadcrumb for each web page downloaded to a web browser associated 
with a client from a web server associated with the Website, the generated breadcrumb 
including navigation information for each downloaded web page; storing breadcrumbs 
associated with web pages downloaded to the web browser at the client; updating the 
stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail 
10 of breadcrumbs associated with navigation of the web pages at the Website; and 
displaying the breadcrumb navigation trail on each downloaded web page for user 
selection. 

According to still another embodiment of the present invention, there is provided a 
15 dynamic client-side breadcrumbing method for improving navigation of a plurality of 
web pages within a Website, the method comprising: storing breadcrumbs associated 
with web pages downloaded to a web browser from a web server associated with the 
Website at the client, the breadcrumbs including navigation information associated with 
downloaded web pages and forming a breadcrumb navigation trail of breadcrumbs 
20 associated with navigation of the web pages at the Website; setting a time stamp 

corresponding to the breadcrumb navigation trail and storing the time stamp at the client; 
downloading a subsequent web page and retrieving the time stamp corresponding to the 
breadcrumb navigation trail stored at the client; determining whether a time interval 
between the time stamp and a time corresponding to the subsequent downloaded web 
25 page exceeds a threshold; and enabling resumption of navigation according to the 
breadcrumb navigation trail by enabling downloading of a web page according to 
navigation information of a last breadcrumb in the breadcrumb navigation trail and 
displaying the breadcrumb navigation trail on the downloaded web page if the time 
interval exceeds the threshold. 

30 
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According to still yet another embodiment of the present invention, there is provided a 
dynamic client-side breadcrumbing system for improving navigation of a plurality of web 
pages within a Website, the system comprising: a web server associated with the Website 
transmitting web pages requested by a client, the web pages embedding a breadcrumbing 
5 engine; and a web browser associated with the client downloading the web pages and 
executing the breadcrumbing engine, the breadcrumbing engine for: storing breadcrumbs 
associated with web pages downloaded to a web browser from a web server associated 
with the Website at the client, the breadcrumbs including navigation information 
associated with downloaded web pages and forming a breadcrumb navigation trail 

1 0 according to user navigation of web pages at the Website, setting a time stamp 

corresponding to the breadcrumb navigation trail and storing the time stamp at the client, 
determining whether a time interval between the time stamp and a time corresponding to 
a subsequent downloaded web page exceeds a threshold, and enabling resumption of 
navigation according to the breadcrumb navigation trail by enabling downloading of a 

1 5 web page according to navigation information of a last breadcrumb in the breadcrumb 
navigation trail and displaying the breadcrumb navigation trail on the downloaded web 
page if the time interval exceeds the threshold. 

According to a further embodiment of the present invention, there is provided a program 
20 storage device, tangibly embodying a program of instructions executable by the machine 
to perform a dynamic client-side breadcrumbing method for improving navigation of a 
plurality of web pages within a Website, the method comprising the step of: storing 
breadcrumbs associated with web pages downloaded to a web browser from a web server 
associated with the Website at a client, the breadcrumbs including navigation information 
25 associated with downloaded web pages and forming a breadcrumb navigation trail 

according to user navigation of the web pages within the Website; setting a time stamp 
corresponding to the breadcrumb navigation trail and storing the time stamp at the client; 
downloading a subsequent web page and retrieving the time stamp corresponding to the 
breadcrumb navigation trail stored at the client; determining whether a time interval 
30 between the time stamp and a time corresponding to the subsequent downloaded web 
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page exceeds a threshold; and enabling resumption of navigation according to the 
breadcrumb navigation trail by enabling downloading of a web page according to 
navigation information of a last breadcrumb in the breadcrumb navigation trail and 
displaying the breadcrumb navigation trail on the downloaded web page if the time 
5 interval exceeds the threshold. 

According to yet a further still a further embodiment of the present invention, there is 
provided a breadcrumbing engine to be embedded into a plurality of web pages within a 
Website for execution at a client web browser for improving navigation of the plurality of 

10 web pages within the Website, the breadcrumbing engine comprising: mechanism for 
generating a breadcrumb for each web page downloaded to a web browser associated 
with a client from a web server associated with the Website, the generated breadcrumb 
including navigation information for each downloaded web page; mechanism for storing 
breadcrumbs associated with web pages downloaded to the web browser at the client; 

1 5 mechanism for updating the stored breadcrumbs with the generated breadcrumb to form a 
breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages 
at the Website; and mechanism for displaying the breadcrumb navigation trail on each 
downloaded web page for user selection. 

20 According to still a further embodiment, there is provided a breadcrumbing engine to be 
embedded into a plurality of web pages within a Website for execution at a client web 
browser for improving navigation of the plurality of web pages within the Website, the 
breadcrumbing engine comprising: mechanism for storing breadcrumbs associated with 
web pages downloaded to a web browser from a web server associated with the Website, 

25 the breadcrumbs including navigation information associated with downloaded web 
pages and forming a breadcrumb navigation trail according to user navigation of web 
pages at the Website; mechanism for setting a time stamp corresponding to the 
breadcrumb navigation trail and storing the time stamp at the client; mechanism for 
determining whether a time interval between the time stamp and a time corresponding to 

30 a subsequent downloaded web page exceeds a threshold; and mechanism for enabling 
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resumption of navigation according to the breadcrumb navigation trail by enabling 
downloading of a web page according to navigation information of a last breadcrumb in 
the breadcrumb navigation trail and displaying the breadcrumb navigation trail on the 
downloaded web page if the time interval exceeds the threshold. 

5 

BRIEF DESCRIPTION OF THE DRAWINGS 

The objects, features and advantages of the present invention will become apparent to one 
skilled in the art, in view of the following detailed description taken in combination with 
1 0 the attached drawings, in which: 

Figure 1 is an exemplary block diagram of a breadcrumb navigation system according to 
the present invention. 

1 5 Figure 2 is an exemplary embodiment of a method flowchart for dynamically generating 
and maintaining a client-side breadcrumb navigation trail according to the present 
invention. 

Figure 3 is an exemplary method flowchart for dynamically displaying the client-side 
20 breadcrumb navigation trail generated in Figure 2 according to the present invention. 

Figure 4 is another exemplary embodiment of a method flowchart for dynamically 
generating and maintaining a client-side breadcrumb navigation trail, and resuming 
navigation according to the generated client-side breadcrumb navigation trail according 
25 to the present invention. 

Figure 5 is an exemplary web browser window depicting the generated client-side 
breadcrumb navigation trail according to Figures 1-4. 

30 
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DETAILED DESCRIPTION OF THE 
PREFERRED EMBODIMENT OF THE INVENTION 



The present invention is directed to method and system for dynamically generating and 
5 maintaining a client-side breadcrumb navigation trail for improving navigation of a 
plurality of web pages within a Website. 

Figure 1 is an exemplary block diagram of a breadcrumb navigation system 100 
according to the present invention. In the breadcrumb navigation system 100, Website 

10 1 14 comprises a web server 1 16, which in turn maintains web pages 108. Although the 
breadcrumb navigation system 100 depicts only one web server 1 16 for simplicity, it is 
contemplated that the Website 1 14 may comprise a plurality of web servers, each 
comprising a plurality of web pages, for servicing client requests. According to the 
breadcrumb navigation system 100, the web server 116 integrates (or embeds) a 

1 5 breadcrumb engine 1 1 2 into web page 1 08, which includes HTML data 110. The web 
server 1 16 of Website 1 14 is interconnected via a communications network 102 to client 
104. The client 104 comprises a web browser 106 for displaying the web page 108 
transmitted by the web server 116. 

20 In operation, a user of client 104 utilizes the web browser 106 for transmitting a request 
for a web page 108, which is identified by a Uniform Resource Locator (i.e., "URL"), 
over the communications network 102 to web server 114. In response to the request, the 
web server 116 services the request by transmitting the web pages 108 identified by the 
URL to the web browser 106, which displays the HTML data 1 10 to the user and 

25 executes the integrated (or embedded) breadcrumb engine 1 12. The breadcrumb engine 
is preferably implemented using JavaScript scripting language developed by Netscape 
Communications Corp. or JScript developed by Microsoft Corp. Alternatively, other 
scripting tools may be easily be implemented according to the teachings of the present 
invention. According to the present invention, the breadcrumb navigation system 1 00 

30 utilizes conventional communications protocols, e.g., HyperText Transfer Protocol (i.e., 
"HTTP"), for communications between the web server 116 and client 104 over 
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communications network 102. The breadcrumb engine 1 12 enhances navigation within 
the Website 1 14 by dynamically generating, maintaining and displaying a client-side 
breadcrumb navigation trail, and resuming navigation according to the client-side 
breadcrumb navigation trail at the client 104, as particularly illustrated in Figures 2-5 
5 herein below. 

Figure 2 is an exemplary embodiment of method flowchart 200 for dynamically 
generating and maintaining a client-side breadcrumb navigation trail according to the 
present invention. It is assumed at this point that the client 104 has requested the web 

1 0 page 1 08 and the web server 1 1 6 has serviced the request by transmitting the web page 
108 to the client's web browser 106, which has executed the breadcrumb engine 1 12. 
Since the web page 108 is currently displayed by the client's web browser, it will be 
referred to as the current web page in the following description of Figure 2. The 
breadcrumb engine 1 12 of Figure 1 executes the methodology depicted in flowchart 200. 

1 5 A JavaScript function update_breadcrumb_navigation_trail( ) depicted in Table 2 below, 
illustrates a sample JavaScript code for implementing the method flowchart 200. The 
functions is executed within the HTML data 1 10 by the following function call: 
update_breadcrumb_navigation_trail("breadcrumb_cookie", "remove" 
document.forms[0].bctitle.value, document. location). The first argument, 

20 "breadcrumb cookie ", is a desired name for a client-side cookie that will maintain the 
breadcrumbs in the breadcrumb navigation trail. One skilled in the art will appreciate 
that other means for maintaining the breadcrumb navigation trail at the client may be 
utilized, such as a file or other persistent storage. The second argument, "remove ", 
allows removing a breadcrumb and all subsequent breadcrumbs from the breadcrumb 

25 navigation trail if a breadcrumb associated with the current page already appears in the 
trail. If desired, the breadcrumb navigation trail may maintain all breadcrumbs regardless 
of whether a breadcrumb already appears in the breadcrumb navigation trail. The third 
argument, document.forms[0].bctitle. value, is comprised of a pre-built document object, 
which belongs to a set of pre-existing objects known as the "Document Object Model" 

30 (i.e., "DOM") for allowing JavaScript to manipulate the current web page, i.e., such as 
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accessing an HTML form tag within the web page, and the HTML form tag that is 
included in the current web page for defining an invisible title (i.e., not displayed by the 
web browser) for the current web page. An exemplary hidden HTML input form tag is 
illustrated in Table 1 below. The last argument, document, location, is a URL for the 
5 current web page. The third and fourth arguments define the breadcrumb in the 
breadcrumb navigation trail, which is illustrated below with reference to Figure 2. 

Table 1 particularly illustrates an exemplary hidden HTML form tag for defining an 
invisible title for a web page according to the present invention. 

10 

Table 1 

<form> 

<input type=hidden name=bctitle value="page3"> 
</form> 

15 

The method for dynamically generating, and maintaining a client-side breadcrumb 
navigation trail starts at step 202 of Figure 2. At step 204, it is determined whether the 
client 104 has cookies associated with the current web page (i.e., web page 108). It 
should be noted that a web page may have a plurality of cookies associated with it. If the 

20 cookies associated with the current page do not exist at the client 1 04, the method 

continues at step 216. If cookies associated with the current page exist at the client 1 04, 
at step 206 it is determined whether the client 104 has a breadcrumb cookie for the 
current web page. If the cookies for the current web page or the breadcrumb cookie for 
the current web page do not exist, then at step 216 breadcrumb information is set to a 

25 breadcrumb associated with the current web page. Then, at step 218a breadcrumb 
cookie for the current web page is created, and the method continues at step 220 
described hereinafter. If the breadcrumb cookie exists, breadcrumb information is 
retrieved from the breadcrumb cookie at step 208. The breadcrumb cookie maintains the 
breadcrumb navigation trail in the following exemplary fashion: 

30 "breadcrumb__cookie=bct=page 1 bcu=www.page 1 .htmbct=page2bcu=www.page2.htmbct 
=page3bcu=www.page3.htm;". The bet corresponds to the title of the breadcrumb to be 
displayed and the bcu corresponds to the URL of the breadcrumb to be displayed. Thus, 
END920010022US1 -U- 



the breadcrumb information comprises the consecutive bct-bcu pairs for breadcrumbs in 
the breadcrumb navigation trail. At step 210, it is determined whether a breadcrumb 
associated with the current web page is in the breadcrumb information. If the 
breadcrumb associated with the current web page is found in the breadcrumb 

5 information, the breadcrumb and all subsequent breadcrumbs are deleted from the 

breadcrumb information at step 212 and the method continues to step 214. However, if 
the breadcrumb is not found in the breadcrumb information at step 210, then at step 214 
the breadcrumb for the current web page is appended to the breadcrumb information. At 
step 220, the breadcrumb information is written into the breadcrumb cookie for the 

1 0 current web page. At step 222, the breadcrumb information in the breadcrumb cookie is 
displayed on the current web page as HTML links in accordance with the method 
flowchart of Figure 3, which is described hereinafter. At step 224, the method for 
dynamically generating and maintaining a client-side breadcrumb navigation trail ends. 

1 5 Table 2 particularly illustrates an exemplary JavaScript function for dynamically 
generating and maintaining a client-side breadcrumb navigation trail according an 
embodiment of the present invention. 

Table 2 

20 function update_breadcrumb_navigation_trail(cookie_name, parm, bctitle, bcurl) { 

// See whether this page in the breadcrumb cookie, then display the breadcrumbs. 

// If parm is "remove" and current page is in the cookie, delete this page and subsequent pages. 

// Add this page to the breadcrumb cookie. 

25 

cookie_text=""; 

// check whether there are cookies 
if (document. cookie. length>0) { 

spot = document.cookie.indexOf(cookie_name+"="); 

30 // do we have this cookie 

if (spot>-l) { 

// get cookie text 

end = document.cookie.indexOf(";", spot); 

if(end=-l) { 
35 end = document.cookie. length; 

cookietext = document.cookie.substring(spot+cookie_name.length+l, end); 
spot=cookie_text.indexOf("bct="+bctit!e); 
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// if parm is remove and this page is already there, remove it and anything after it. 
if (parm— 'remove" && spot>-l) { 
if (spot=0) { 

cookie_text=" fl ; 

5 } 

else { 

cookiejext = cookie_text.substr(0,spot); 

} 

} 

10 } 

} 

// add current page to cookie 

cookie_text=cookie_text+"bct="+bctitle+"bcu="+bcurl; 
document.cookie= cookie_name+"="+cookie_text; 
1 5 display_breadcrumb_navigation_trail(cookie_name); 

} 

Figure 3 is an exemplary method flowchart 300 for dynamically displaying the client-side 
20 breadcrumb navigation trail generated in Figure 2 according to the present invention. 
Once again, it is assumed at this point that the client 104 has requested the web page 108 
and the web server 1 16 has serviced the request by transmitting the web page 108 to the 
client's web browser 106, which has executed the breadcrumb engine 1 12. Furthermore, 
since the web page 108 is currently displayed by the client's web browser, it will be 
25 referred to as the current web page in the following description of Figure 3 . The 

flowchart 300 is part of the breadcrumb engine 1 1 2 of Figure 1 . A JavaScript function 
display_breadcrumb_navigation_trail( ) depicted in Table 3 below, illustrates a sample 
JavaScript code for implementing the method flowchart 300. The function is executed by 
a call from function update_breadcrumb_navigation_trail( ): 
30 display_breadcrumb_navigation_trail("breadcrumb_cookie"). 

The method for dynamically displaying the client-side breadcrumb navigation trail 
generated in Figure 2 starts at step 302 of Figure 3. At step 304, it is determined whether 
the client 104 has cookies associated with the current web page. If cookies associated 
3 5 with the current web page do not exist, then display method ends at step 320. If cookies 
associated with the current page exist at the client 104, at step 306 it is determined 
whether the client 104 has a breadcrumb cookie for the current web page. 
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If the breadcrumb cookie does not exist, then the display method likewise ends at step 
320. However, if the breadcrumb cookie for the current web page exists, then at step 308 
breadcrumb information from the breadcrumb cookie is retrieved and breadcrumbs in the 
breadcrumb information iterated at step 310-316. At step 3 1 0, a breadcrumb from the 
5 breadcrumb information is retrieved. At step 3 1 2, it is determined whether this 

breadcrumb is a last breadcrumb in the breadcrumb information. If, the breadcrumb is 
not the last breadcrumb, then at step 3 14 an HTML link associated with the retrieved 
breadcrumb is generated. At step 3 1 6, the generated link is displayed on the current web 
page by writing the HTML link into the HTML data 1 10 of the current web page (i.e., 
10 web page 108). The iteration of the breadcrumb information continues until it is 

determined that the last breadcrumb is retrieved from the breadcrumb information at step 
312. At step 318, the last breadcrumb is displayed as placing HTML text (i.e., not an 
HTML link), since the current web page is the last breadcrumb in the breadcrumb 
information. At step 320, the display method ends. 

15 

Table 3 particularly illustrates an exemplary JavaScript function for dynamically 
displaying the client-side breadcrumb navigation trail according to the present invention. 



Table 3 

20 function display_breadcrumb_navigationJrail(cookie_name) { 

// check whether there are cookies 
if (document.cookie.length>0) { 

spot = document.cookie.indexOf(cookie_name+' -"); 
25 // check whether there is this cookie 

if(spot>-l){ 

// get cookie text 

end = documentcookie.indexOf(";", spot); 
if (end=-l) end = documentcookie.length; 
30 cookie Jext = document.cookie.substring(spot, end); 

// Loop thru the cookie text, display all titles except last title as HTML links 
// Display last title as plain HTML text 
spot = cookie_text.indexOf( n bct="); 
35 while (spot>-l) { 

// get title 

end = cookie JextJndexOf( n bcu-\spot+4); 
bctitle = cookie Jext.substring(spot+4,end); 
END920010022US1 -14- 



spot = cookie_text.indexOf( M bct=",end+4); 
if (spot==-l) { 

document. writeln(" > "+bctitle); 

} 

5 else { 

bcurl=cookie_text.substring(end+4, spot); 
documentwritelnC > <a href= m +bcur1+ , "> , +bctitle+'</a> , ); 

} 

} 

10 } 

} 

} 

Figure 4 is another exemplary embodiment of a method flowchart for dynamically 
1 5 generating and maintaining a client-side breadcrumb navigation trail, and resuming 
navigation according to the generated client-side breadcrumb navigation trail according 
to the present invention. As before, it is assumed that at this point the client 104 has 
requested the web page 108 and the web server 1 16 has serviced the request by 
transmitting the web page 108 to the client's web browser 106, which has executed the 
20 breadcrumb engine 1 1 2. Since the client's web browser currently is displaying the web 
page 108, it will be referred to as the current web page in the following description of 
Figure 4. This embodiment of flowchart 400 replaces the embodiment of the flowchart 
of Figure 2 as part of the breadcrumb engine 1 12 of Figure 1. A JavaScript function 
update J)readcrumb_navigation_trail( ) depicted in Table 4 below, illustrates a sample 
25 JavaScript code for implementing the method flowchart 400. This function is executed in 
like fashion to the function illustrated in Table 2 and described with regard to Figure 2. 

The embodiment of the method for dynamically generating and maintaining a client-side 
breadcrumb navigation trail, and resuming navigation according to the generated client- 

30 side breadcrumb navigation trail, starts at step 402 of Figure 4. At step 404 a revisit time 
is defined in the current web page, which designates a period of time after which a user 
returning to the web page will be prompted whether the user would like to resume 
navigation according to the client-side breadcrumb navigation trail dynamically 
generated and maintained during the user's prior visit to the web page. Furthermore, at 

3 5 step 404 a current date and time are determined. At step 204, it is determined whether 
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the client 104 has cookies associated with the current web page. If there are no cookies 
associated with the current page at the client 104, the method continues at step 216. If 
cookies associated with the current page exist at the client 104, at step 206 it is 
determined whether the client 104 has a breadcrumb cookie for the current web page. If 

5 the cookies for the current web page or the breadcrumb cookie for the current web page 
do not exist, then at step 216 the breadcrumb information is set to a breadcrumb 
associated with the current web page. Then, at step 218 a breadcrumb cookie for the 
current web page is created, and the method continues to step 418. At step 418, a last 
visit is set to the current date and time determined at step 404. The breadcrumb cookie is 

1 0 updated with the last visit date and time and with breadcrumb information at step 420, 
and at step 422 the breadcrumb information in the breadcrumb cookie is displayed as 
HTML links according to the method of Figure 3. At step 422, the method for 
dynamically generating and maintaining a client-side breadcrumb navigation trail, and 
resuming navigation according to the client-side breadcrumb navigation trail, ends. 

15 

However, if the breadcrumb cookie exists at step 206 of Figure 4, then the last visit date 
and time and breadcrumb information are retrieved from the breadcrumb cookie at step 
406. At step 408, it is determined whether the user had been away from the web page for 
a designated period of time (i.e., revisit time date and time) defined at step 404. This 

20 determination is accomplished by subtracting the last visit date and time from the current 
date and time and determining whether this result is greater than the revisit time. If the 
result is greater than the revisit time, the user is prompted at step 410 regarding whether 
the user would like to resume navigation according to the generated client-side 
breadcrumb navigation trail from the last visit. If the user chooses to continue 

25 navigation, at step 4 14 the last visit date and time is set to current date and time and the 
breadcrumb cookie is updated with this time. Then, at step 416 the last breadcrumb is 
retrieved from the breadcrumb information and a location for the current web page is set 
to the last breadcrumb (i.e., the URL associated with the last breadcrumb), thereby 
resulting in a request being transmitted to the web server 1 16 for the web page identified 

30 by the URL, which is serviced by the server 1 1 6 and transmitted to the web browser 1 06 
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for display. Thereafter, the method ends at step 422. However, if the determination at 
step 408 reveals that the user has not been away from the web page for the designated 
period of time, the method continues at step 210. Furthermore, if the user at step 410 
does not want to resume navigation according to the client-side breadcrumb navigation 

5 trail from the last visit, then at step 4 1 2 all breadcrumbs are deleted from the breadcrumb 
information. Thereafter, the method continues to step 210. At step 210, it is determined 
whether a breadcrumb associated with the current web page is in the breadcrumb 
information. If the breadcrumb is not in the breadcrumb information, the method 
continues at step 214. If the breadcrumb is in breadcrumb information, at step 212 the 

1 0 breadcrumb and subsequent breadcrumb are deleted from the breadcrumb information. 
At step 214, the breadcrumb associated with the current web page is appended to the 
breadcrumb information. Then the method continues from step 4 1 8 to step 420 to step 
222 and finally to step 422, as described above. 

1 5 Table 4 particularly illustrates an exemplary JavaScript function for dynamically 
generating and maintaining a client-side breadcrumb navigation trail, and resuming 
navigation according to the client-side breadcrumb navigation trail, according an other 
embodiment of the present invention. 

20 Table 4 

function update_breadcrumb_navigation_trail(cookie_name, parm, bctitle, bcurl) { 

// See whether this page in the breadcrumb cookie, then display the breadcrumbs. 
// If parm is "remove" and current page is in the cookie, this page and subsequent pages. 
25 // Add this page to the breadcrumb cookie. 

// Add current date and time at the beginning of the breadcrumb cookie 

// Check this date and time to see whether user has been away for a designated amount of time 

// If user has been away longer, prompt user whether to resume navigation where user left off. 

30 

today = new Date( ); 

revisitjime = 1000 *60 *3; 1/3 min.: 1000 milliseconds * 60 sec/min. * 3 
cookie_text=""; 

35 // check whether there are cookies 

if (document.cookie.length>0) { 

spot = document.cookie.indexOf(cookie_name+"- '); 
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// do we have this cookie 

if (spot>-l) { 

//get last visit date and time 
spot = documentxookie.indexOfCiastvisit="); 
5 end = documentxopkie jndexOf("bct=",spot); 

lastvisit = new Date (document.cookie.substring(spot+10,end)); 



// get cookie text 

spot = end; //skip past date and time information 
10 end = document.cookie.indexOf( M ;'\ spot); 

if(end=-l){ 

end = document.cookie. length; 

cookie Jext = document.cookie.substring(spot+cookie_name.length+l , end); 

// determine whether past revisit time and prompt to resume where left off. 
if(today - lastvisit > revisit Jime) { 

if(confirm("Do you want to resume where you left off last time?")) { 
document.cookie = cookie_name+' '=lastvisit="+today+cookie_text; 
20 spot = cookieJext.lastIndexOf("bcu- '); 

document.location=cookieJextsubstring(spot+4); 

return; 

} 

else { 

25 cookie_text= ""; 

} 

} 

// check whether this page already in the list 
spot=cookie_text.indexOf("bct="+bctitle); 
30 // if parm is remove and this page is already there, remove it and anything after it. 

if (parm="remove" && spot>-l) { 
if (spot==0) { 

cookie_text= ""; 

} 

35 else { 

cookie_text = cookieJext.substr(0,spot); 

} 

} 

} 

40 } 

// add date and time and current page to cookie 
cookie_text=cookie_text+"bct="+bctitle+"bcu="+bcurl; 
document.cookie=cookie_name+"=lastvisit="+today+cookie_text; 
display_breadcrumb_navigation_trail(cookie_name); 

45 } 



Figure 5 is an exemplary web browser window 500 depicting the dynamically generated 
and maintained client-side breadcrumb navigation trail 514 according to Figures 1-4. As 
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depicted in Figure 5, the web browser window 500 includes a title bar 502, a menu 504, a 
plurality of buttons 506, a location input field 508 and a status bar 518, all of which 
perform a variety of functions. The web browser window 500 is produced by a Netscape 
Communicator web browser of Netscape Communications. Other web browsers, such as 
5 Internet Explorer by Microsoft Corporation, may likewise be implemented to take 

advantage of the present invention. The web browser window 500 displays a web page 
510 that includes a plurality of HTML links 512, a breadcrumb navigation trail 514 and a 
plurality of tabs 516 for navigation within an IBM Website (i.e., identified by 
www.IBM.com), comprising a plurality of web servers and web pages. The displayed 

10 web page 510 is downloaded by the web browser 106 from the web server 116 of Figure 
1 and provides a user with information content. The user interacts with the browser 
window and the displayed web page by using a pointing device (e.g., a mouse). 
According to the present invention, the displayed web page 5 1 0 includes HTML data 1 1 0 
for providing information content to the user and a breadcrumb engine 1 1 2 for 

1 5 dynamically generating and maintaining a client-side breadcrumb navigation trail, and 
resuming navigation according to the client-side breadcrumb navigation trail. 

While the invention has been particularly shown and described with respect to preferred 
embodiments thereof, it will be understood by those skilled in the art that the foregoing 
20 and other changes in form and details may be made therein without departing from the 
spirit and scope of the invention, as particularly embodied in the appended claims. 
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